
{% if not_enough_contacts %}
	<div class='two_contacts_required'>
		<p>Чтобы использовать приложение &laquo;{{app_name}}&raquo;, необходимо иметь как минимум 2 контакта.</p>		
		<p>Пообщайтесь и возвращайтесь &mdash; мы ждём Вас!</p>
	</div>
{% else %}
<div id='board-container' style='position: fixed; z-index: 2; top: 40px; left: 3000px'>
	<div id='board' style='width: 799px; height: 499px; background: url( "/static/img/board.png" )'>
		<div id='score1_container' class='droppable' style='position: absolute; left: 60px; top: 85px; width: 319px; height: 363px; padding: 0px'></div>
		<div id='score0_container' class='droppable' style='position: absolute; left: 420px; top: 85px; width: 319px; height: 363px; padding: 0px'></div>	
	</div>
	
	<div id='continue' class='margin-top' style='clear: both; margin-top: 20px; margin-left: 20px; visibility: hidden'>
		<div class='blue-button' onclick='onContinue( {{next_section}} )'>Продолжить</div>
	</div>
</div>

{% for score in scores.0 %}
	<input id='c_{{score.0}}' value='{{score.1}},{{score.2}}' class='score0' type='hidden'>
{% endfor %}

{% for score in scores.1 %}
	<input id='c_{{score.0}}' value='{{score.1}},{{score.2}}' class='score1' type='hidden'>
{% endfor %}

<div id='photo_frame_template' style='width: 110px; height: 150px; background: url( "/static/img/frame.png" ); padding: 10px; display: none; position: absolute; cursor: pointer'>
	<div name='photo' style='width: 110px; height: 150px; overflow: hidden'>
		<div class='start-photo-caption' style='overflow: hidden'>
			<a target='_blank'>Анкета</a>
		</div>
		<img name='icon' style='display: none; position: absolute; bottom: 3px; right: 3px; width: 16px; height: 16px' src=''>
	</div>
</div>

<div id='minimum' style='display: none'>
	<p>Требуется как минимум по одному контакту в каждой категории &mdash;<br>с кем Вы хотете и не хотите общаться.</p>
</div>
{% endif %}